<!--
 * @FilePath     : /study_code/layui/21-2 copy.html
 * @Description  : 垂直菜单手风琴效果
 * @Date         : 2025-04-15 14:21:27
 * @Author       : Fang YingGui
 * @LastEditors  : fangyinggui 18715384437@163.com
 * @LastEditTime : 2025-04-15 14:21:32
-->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>documentName</title>
    <link rel="stylesheet" href="/layui/dist/css/layui.css" />
  </head>
  <body>
    <!-- .layui-nav-tree 容器开启：lay-accordion 属性开启 -->
    <ul class="layui-nav layui-nav-tree layui-nav-side" lay-accordion>
      <li class="layui-nav-item layui-nav-itemed">
        <a href="javascript:;">默认展开</a>
        <dl class="layui-nav-child">
          <dd><a href="javascript:;">选项1</a></dd>
          <dd><a href="javascript:;">选项2</a></dd>
          <dd><a href="javascript:;">选项3</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item">
        <a href="javascript:;">默认收缩</a>
        <dl class="layui-nav-child">
          <dd><a href="javascript:;">选项1</a></dd>
          <dd><a href="javascript:;">选项2</a></dd>
          <dd><a href="javascript:;">选项3</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item"><a href="javascript:;">菜单1</a></li>
      <li class="layui-nav-item"><a href="javascript:;">菜单2</a></li>
      <li class="layui-nav-item"><a href="javascript:;">菜单3</a></li>
    </ul>

    <script src="/layui/dist/layui.js"></script>
  </body>
</html>
